<template>
    <a-modal title="选择单位" width="50%" :visible="visible" :confirmLoading="loading" okText="选择" @ok="handleChoose" @cancel="() => {
        this.visible = false
    }
        ">
        <div class="table-page-search-wrapper">
            <a-form layout="inline">
                <a-row :gutter="10">
                    <a-col :md="8" :sm="24">
                        <a-form-item>
                            <a-input v-model="queryParam.KeyWord" placeholder="单位" />
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="24">
                        <a-button type="primary" @click="() => {
                            this.pagination.current = 1
                            this.getDataList()
                        }
                            ">查询</a-button>
                        <a-button style="margin-left: 8px" @click="() => (queryParam = {})">重置</a-button>
                    </a-col>
                </a-row>
            </a-form>
        </div>

        <a-table :columns="columns" :rowKey="(row) => row.Id" :dataSource="data" :pagination="pagination" :loading="loading"
            @change="handleTableChange"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange,type:'radio' }" :bordered="true"
            size="small">
        </a-table>
    </a-modal>
</template>

<script>

const columns = [
    {
        title: '序号',
        dataIndex: 'code',
        width: '50px',
    },
    { title: '单位', dataIndex: 'name' },
    // { title: '编码', dataIndex: 'Taxproductcode' },
    // { title: '规格型号', dataIndex: 'TM_Specs' },
    // { title: '单位', dataIndex: 'TM_Unit' },
    // { title: '售价', dataIndex: 'TM_UnitPrice' },
]

export default {
    // props: {
    //     type: { type: String, default: 'radio', required: false },
    // },
    components: {
    },
    mounted() {
        console.log(this.data)
        // this.getDataList()
    },
    data() {
        return {
            data: [],
            pagination: {
                current: 1,
                pageSize: 25,
                showTotal: (total, range) => `总数:${total} 当前:${range[0]}-${range[1]}`,
            },
            filters: {},
            sorter: { field: 'Id', order: 'asc' },
            loading: false,
            columns,
            queryParam: { Condition: 'name' },
            selectedRowKeys: [],
            selectedRows: [],
            visible: false,
            UnitGroupId: '',
            TypeName: '',
            type:'',
        }
    },
    methods: {
        handleTableChange(pagination, filters, sorter) {
            this.pagination = { ...pagination }
            this.filters = { ...filters }
            this.sorter = { ...sorter }
            this.getDataList()
        },
        getDataList() {
            console.log('计量单位id' + this.UnitGroupId)
            this.selectedRowKeys = []
            this.selectedRows = []
            this.loading = true
            this.$http
                .post('/InvoiceManagement/aa_unit/GetDataList', {
                    "PageIndex": this.pagination.current,
                    "PageRows": this.pagination.pageSize,
                    "SortField": "Id",
                    "SortType": "ace",
                    "Search": this.queryParam
                })
                .then((resJson) => {
                    this.loading = false
                    this.data = resJson.Data
                    const pagination = { ...this.pagination }
                    pagination.total = resJson.Total
                    this.pagination = pagination
                })
        },
        onSelectChange(selectedRowKeys, selectedRows) {
            this.selectedRowKeys = selectedRowKeys
            this.selectedRows = selectedRows
        },
        hasSelected() {
            return this.selectedRowKeys.length > 0
        },
        openChoose(type) {
            console.log(type)
            this.type = type;
            this.getDataList()
            this.visible = true
        },
        handleChoose() {
            this.visible = false
            this.$emit('onChoose', this.selectedRows,this.type)
        },
    },
}
</script>
<style scoped>
/deep/ .ant-modal {
    top: 10px !important;
}
</style>